@extends("admin.base.base")
@section("title")
    <title>问答列表</title>
    <meta name="viewport" content="user-scalable=no" />
    <link href="{{ asset('css/admin/css/base.css') }}" rel="stylesheet">
    <script type="text/javascript" src="{{asset('js/admin/jquery.min.js')}}"></script>
    <script type="text/javascript" src="{{asset('js/admin/jquery.nicescroll.min.js')}}"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $("#boxscroll4").niceScroll("#boxscroll4 .wrapper",{boxzoom:true});
        });
    </script>
@endsection
@section('content')
    <div class="page-container">
        <form class="form form-horizontal" id="form-article-add" enctype="multipart/form-data">
            <div class="row cl">
                <label class="form-label col-xs-4 col-sm-2">标题：</label>
                <div class="formControls col-xs-3 col-sm-3">
                    <span>{{$topic->title}}</span>
                </div>
            </div>
            <div class="row cl">
                <label class="form-label col-xs-4 col-sm-2">发表人：</label>
                <div class="formControls col-xs-3 col-sm-3">
                    <span>{{$topic->user->name}}</span>
                </div>
            </div>
            <div class="row cl">
                <label class="form-label col-xs-4 col-sm-2">发表时间：</label>
                <div class="formControls col-xs-3 col-sm-3">
                    <span>{{$topic->created_at}}</span>
                </div>
            </div>
            <div class="row cl">
                <label class="form-label col-xs-4 col-sm-2">评论次数：</label>
                <div class="formControls col-xs-3 col-sm-3">
                    <span>{{$topic->reply_count}}</span>
                </div>
            </div>
            <div class="row cl">
                <label class="form-label col-xs-4 col-sm-2">查看总数：</label>
                <div class="formControls col-xs-3 col-sm-3">
                    <span>{{$topic->view_count}}</span>
                </div>
            </div>
            <div class="row cl">
                <label class="form-label col-xs-4 col-sm-2">内容：</label>
                <div class="formControls col-xs-6 col-sm-6">
                    <span>{{$topic->body}}</span>
                </div>
            </div>
        </form>
        <div class="row cl replies-button" style="padding: 25px 0 25px 0">
            <div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-2">
                <button class="btn btn-success to-view" type="button">&nbsp;&nbsp;查看评论&nbsp;&nbsp;</button>
                <button onClick="layer_close();" class="btn btn-dark" type="button">&nbsp;&nbsp;返回&nbsp;&nbsp;</button>
            </div>
        </div>
        <div id="boxscroll4" style="display: none">
            <div class="wrapper">
                <ul class="commentList">
                    @foreach($replies as $index => $reply)
                        <li class="item cl"> <a href="#"><i class="avatar size-L radius"><img alt="" src="{{$reply->user->avatar}}"></i></a>
                            <div class="comment-main">
                                <header class="comment-header">
                                    <div class="comment-meta"><a class="comment-author" href="#">{{$reply->user->name}}</a> 评论于
                                        <time title="{{$reply->created_at}}" datetime="{{$reply->created_at}}">{{$reply->created_at->diffForHumans()}}</time>
                                    </div>
                                </header>
                                <div class="comment-body">
                                    <p>{{$reply->content}}</p>
                                </div>
                            </div>
                        </li>
                    @endforeach
                </ul>

            </div>

        </div>

    </div>
@endsection
@section("js")
    <script>
        var isAdvanced = false;
        $(".to-view").click(function () {
            isAdvanced = !isAdvanced;
            if (isAdvanced){
                $(this).html('隐藏评论');
                $('.to-view').toggleClass('btn-danger');
                $("#boxscroll4").css("display","block");
            }else {
                $(this).html('查看评论');
                $('.to-view').removeClass('btn-danger');
                $("#boxscroll4").css("display","none");
            }

        })
    </script>
@endsection
